import  {useState} from 'react';
import {Button, Modal, Input} from 'antd';
import styles from './index.module.css';

export default function ImportDialog() {
    const [isModalOpen, setIsModalOpen] = useState(true);
    const [inputValue, setInputValue] = useState('');

    const handleImport = () => {
        alert('导入成功!');
    };

    // 取消关闭
    const handleCancel = () => {
        console.log('取消操作');
        setIsModalOpen(false);
    };

    return (
        <div className="p-4">
            <Modal
                centered
                title="导入链接"
                open={isModalOpen}
                footer={null}
                width="26%"
                onCancel={handleCancel}
            >
               <div className={styles.content}>
                   <Input
                       className={styles.input}
                       placeholder="请粘贴到此处"
                       value={inputValue}
                       onChange={(e) => setInputValue(e.target.value)}
                   />
                   <Button type="primary" onClick={handleImport} className={styles.button}>
                       导入
                   </Button>
               </div>
            </Modal>
        </div>
    );
}
